<template>
  <div class="approvals-container">
    <div class="app-container">
      <h2>
        审批
      </h2>
      <!-- 父子组件通信中 父传子的属性写value 子组件接收value属性
           子传父的时候发布的自定义事件 input. 就可以在组件上使用v-model
           要求: 在组件上使用v-model 子组件接收的数据必须是value 发布的自定义事件必须是
           input
       -->
      <!-- $event就是子传父传过来的数据 -->
      <!-- <MySon :value="car" @input="car = $event" /> -->

      <!-- 父传子并且子传父的时候在组件上传递一个属性 可以使用v-model简写
        如果传递多个属性父传子并且子传父, 可以使用.sync修饰符来处理
        1. 传递属性的时候 :属性.sync="传递的属性"
        2. 发布自定义事件的时候自定义事件是  update:属性 , 会自动将子组件更新的数据同步给父组件
       -->
      <MySon v-model="car" :money="money" @changeMoney="money = $event" />
      <MySon v-model="car" :money.sync="money" :baby.sync="baby" />
    </div>
  </div>
</template>

<script>
import MySon from './MySon.vue'
export default {
  name: 'Approvals',
  components: { MySon },
  data() {
    return {
      car: '宾利·添越',
      money: 100,
      baby: 'gold疙瘩'
    }
  }

}
</script>

<style>

</style>
